import React, { Fragment } from 'react';
import PropTypes from 'prop-types';

import './index.less';

const StageType = ({
  type = 'ci',
  parallel = 1,
  noTypeDisplay = false,
}) => {
  const realType = type?.toUpperCase();
  return (
    <>
      {
        noTypeDisplay ? null : (
          <span
            className={`c7n-piplineManage-stage-type c7n-piplineManage-stage-type-${realType}`}
          >
            {realType}
          </span>
        )
      }
      <span
        className={`c7n-piplineManage-stage-type-task c7n-piplineManage-stage-type-task-${parallel ? 'parallel' : 'serial'}`}
      >
        {type === 'CI' ? '任务并行' : '任务串行'}
      </span>
    </>
  );
};

StageType.propTypes = {
  type: PropTypes.string.isRequired,
};

export default StageType;
